import React,{useCallback,useEffect} from 'react'
import { LoginWrapper } from './styledMy'
import left from '@/assets/images/left.png'
import home from '@/assets/images/home.png'
import {useHistory} from 'react-router-dom'
import line from '@/assets/images/line.png'
import dewu from '@/assets/images/dewu.jpg'

export default function Login() {
    const history=useHistory()

    const handleBackClick=useCallback(
        (num)=>{
            return()=>{
                if(num===1){
                    history.goBack()
                }else{
                    history.push('/home')
                }
            }   
        }
    )

    const handleRegister=useCallback(
        ()=>{
            history.push('/phonelogin')
        }
    )
    
 
    return (
        <LoginWrapper >
            <div className='top'>
                <ul className='nav'>
                    <li onClick={handleBackClick(1)}><img src={left} alt="" /></li>
                    <li><img src={line} alt="" /></li>
                    <li onClick={handleBackClick(3)}><img src={home} alt="" /></li>
                </ul>
                <span>登录</span>
            </div>
            <div className='dw'>
                <img src={dewu} alt="" /> 
            </div>
            <div className='login'>
                <p><button className='wechat'>微信登录</button></p>
                <p><button className='phone'
                onClick={handleRegister}
                >手机号登录/注册</button></p>
            </div>
        </LoginWrapper>
    )
}
